<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<script>

function searchProduct(){

	var barcode = $('#barcode').textbox('getValue');
	var productCode = $('#productCode').textbox('getValue');

        $('#dataGridProduct').datagrid({
    		url : 'productJSONAction!selectProducts',   		
    		queryParams: {     	    	
     	    	'formBean.barcode':barcode,
     	    	'formBean.productCode':productCode,
     	    },
    		fit : true,
    		fitColumns : true,
    		pagination : true,
    		striped : true,
    		pageSize : 20,
    		pageList : [20],
    		border : false,
    		checkOnSelect : false,
    		selectOnCheck : false,
    		sortName : 'id',
    		sortOrder : 'desc',
    		singleSelect:true,
    		showFooter:true,
    		rownumbers:true,
    		nowrap : false,
    		columns : [[
    					{field:'id', width:60,title:'ID',fixed:true,
							formatter: function (value, row, index){
							return row.id;
						}},	
						{field:'barcode', width:100,title:'条码',fixed:true},						
						{field:'productCode', width:100,title:'货号',fixed:true},
						{field:'color', width:80,title:'颜色',fixed:true},
						{field:'year', width:80,title:'年份',fixed:true,
							formatter: function (value, row, index){
								return row.year + row.quarter;
							}},
						{field:'brand', width:100,title:'品牌',fixed:true},
						{field:'categoryLevel', width:100,title:'产品线',fixed:true},
						{field:'category', width:100,title:'货品类',fixed:true},						
						{field:'size', width:100,title:'尺码',fixed:true},
						{field:'unit', width:100,title:'齐码/单位',fixed:true,
							formatter: function (value, row, index){
								return row.numPerHand + row.unit;
							}},
						{field:'createTime', width:180,title:'创建时间',fixed:true},
						{field : 'action',title: '选择',width : 50,align: 'center',
							formatter : function(value, row, index) {
								var str = '';
								str += $.formatString('<a href="#" onclick="selectBarcode(\'{0}\');"><img src="{1}"/></a>', row.barcode,'<%=request.getContextPath()%>/conf_files/easyUI/themes/icons/text_1.png');
								return str;
						}}
    			     ]],

    	});
        
       
}

function openProductInfo(){
	 $("#productInfoDiv").dialog("open");
	 searchProduct();
}

function selectBarcode(barcode){
	$("#barcodeInfo").textbox("setValue",barcode);
	$("#productInfoDiv").dialog("close");
}
function clearBarcode(){
	$("#barcodeInfo").textbox("setValue","");
}
function cleanSearch(){

	$("#barcode").textbox("setValue","");
	$("#productCode").textbox("setValue","");
}

</script>

<!-- dialog 表单 -->
<s:form id="productForm" name="productForm" action="" theme="simple" method="POST">
	
</s:form>


<span><strong>条码信息：</strong>	
	<input class="easyui-textbox" style="width:140px"  data-options="prompt:'请输入条码信息'"   id="barcodeInfo" name="formBean.barcode" size="20"></input>
	<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'" onclick="openProductInfo();" style="width: 60px">查找</a>
	<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-no'" onclick="clearBarcode();" style="width: 60px">清除</a>
</span>


<div id="productInfoDiv"  class="easyui-dialog" style="width: 80%; height: 90%;" data-options="title:'货品信息',modal:false,closed:true,resizable:true,border:true">

		<table width="100%" border="0" style="top:15px;left: 50px;position: relative;">
			<tr height="30">
				<td width="7%" align="center"><strong>条码信息：</strong></td>
				<td width="10%" align="left"><input class="easyui-textbox" style="width:140px"  data-options="prompt:'请输入条码信息'"   id="barcode" ></input></td>
				<td width="7%" align="center"><strong>货号信息：</strong></td>
				<td width="10%" align="left"><input class="easyui-textbox" style="width:140px"  data-options="prompt:'请输入货号信息'"   id="productCode" ></input></td>
				<td  width="2%"></td>
				<td align="left"><a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'" onclick="searchProduct();" style="width: 70px">查找</a>
				<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-no'" onclick="cleanSearch();" style="width: 70px">清除</a>
				</td>									
			</tr> 						
																			
		</table>
		
		<div id="cc" class="easyui-layout" style="width:95%;height:90%; top: 30px;left: 40px;">
			<div data-options="region:'center'" style="padding:10px;background:#eee;">
			<table id="dataGridProduct" ></table>
			</div>
		</div>
		
		

</div>